<template>
	<section class="jumbotron">
		<h3 class="jumbotron-heading">Search Github Users</h3>
		<div>
			<input type="text" placeholder="enter the name you search" v-model="keyword"/>&nbsp;
			<button @click="search">Search</button>
		</div>
	</section>
</template>

<script>
	import axios from 'axios'

	export default {
		name: 'Search',
		data() {
			return {
				keyword:'tianyu'
			}
		},
		methods: {
			search(){
				axios.get(`https://api.github.com/search/users?q=${this.keyword}`).then(
					response => {
						// console.log('请求成功了！',response.data.items)
						this.$bus.$emit('get-user-list',response.data.items)
					},
					error => {
						console.log('请求失败了',error)
					}
				)
			}
		},
		mounted(){
			console.log('Search组件挂载了')
			/* setTimeout(()=>{
				this.$bus.$emit('get-user-list',[
					{
						id:'324567890',
						login:'小猪佩奇',
						avatar_url:'https://s3.ax1x.com/2021/01/16/srJlq0.jpg',
						html_url:'http://www.atguigu.com'
					}
				])
			},200) */
		}
	}
</script>